<script setup lang="ts">

</script>

<template>
  <div class="ground">
    <!-- 分道线 -->
    <div v-for="divi, i in 7" :key="i" class="divider_line"></div>
  </div>
</template>

<style lang='scss' scoped>
@keyframes groundBack {
  to {
    transform: translateX(-20%);
  }
}

.ground {
  display: flex;
  width: 140%;
  height: 100%;

  background-color: rgb(99, 96, 96);

  overflow: hidden;

  animation: groundBack .6s linear infinite;

  .divider_line {
    flex-shrink: 0;
    position: relative;
    left: 0;
    bottom: -50%;
    width: 10%;
    height: 10%;
    margin-right: 10%;

    background-color: #fff;

    transform: translateY(-50%);
  }

}
</style>